﻿<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 101 Template</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-select.css" rel="stylesheet">
	<style type="text/css">
		#container {
			margin-top: 60px;
			margin-bottom: 20px;
		}
		.destroy {
			cursor: pointer;
			width: 20px;
			height: 20px;
			background: url(img/destroy.png) no-repeat;
		}
		.destroy:hover {
			background-position: 0 -20px;
		}
    </style>
	<!--<link href="css/bootstrap-responsive.css" rel="stylesheet">-->
  </head>
  <body>
        <div class="navbar navbar-inverse navbar-fixed-top">
		  <div class="navbar-inner">
			<div class="container">
			  <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			  </a>
			  <a class="brand" href="index.html">Шарашкина контора</a>
			  <div class="nav-collapse collapse">
				<ul class="nav">
				  <li class="active"><a href="index.html">Товары</a></li>
				  <li><a href="basket.html" id="basketMenu">Корзина<!--<span> (<strong id="cntBasket"></strong>)</span>--></a></li>
				  <li><a href="orders.html">Заказы</a></li>
				</ul>
			  </div><!--/.nav-collapse -->
			</div>
		  </div>
		</div>
		
		<div class="container" id="container">
		
		<table class="table table-bordered table-striped">
		  <thead>
			  <tr>
				<th>Картинка</th>
				<th>Продукт</th>
				<th>Количество</th>
				<th></th>
			  </tr>
			</thead>
			<tbody id="good-items-list">
			</tbody>
		  </table>

      <hr>

      <footer>
        <p>&copy; Группа 5512</p>
      </footer>

    </div>
		
    
	<script src="js/json2.js"></script>
	<script src="js/jquery.js"></script>
	<script src="js/jquery-ui.js"></script>
	<script src="js/underscore.js"></script>
	<script src="js/backbone.js"></script>
	<script>
		var Store = function(name) {
			this.name = name;
			var store = localStorage.getItem(this.name);
			this.data = (store && JSON.parse(store)) || {};
		};
		_.extend(Store.prototype, {
			save: function() {
				localStorage.setItem(this.name, JSON.stringify(this.data));
			},
		    create: function(model) {
				if (!model.id) model.id = model.attributes.id = guid();
				this.data[model.id] = model;
				this.save();
				return model;
			},
			update: function(model) {
				this.data[model.id] = model;
				this.save();
				return model;
			},
			find: function(model) {
				return this.data[model.id];
			},
			findAll: function() {
				return _.values(this.data);
			},
		});
	</script>
	<script src="js/goods.js"></script>
	<script src="js/bootstrap.js"></script>
	<script src="js/bootstrap-select.js"></script>
	
	<script type="text/template" id="item-template">
		<td class="span3"><img width="50%" src="<%= img %>"></td>
		<td><strong><%= name %> <span class="muted">#<%= id %></span></strong><br></td>
		<td><input type="text" placeholder="1" class="input-mini" value="1"></td>
		<td class="span2"><input type="button" class="btn btn-primary" value="В корзину"></td>
	</script>

  </body>
</html>